<template>
  <div>
    <hzhy-data-table ref="dataTable" v-bind="tableConfigTask"></hzhy-data-table>
  </div>
</template>

<script>
import * as api from '@/const/api'

export default {
  title: '注册申请处理',
  name: 'CustomerApply',
  components: {},
  data() {
    return {}
  },
  computed: {
    tableConfigTask() {
      return {
        url: api.userPage,
        customQuery: {
          userType: 3,
        },
        columns: [
          {
            label: '序号',
            type: 'index',
            prop: 'index',
          },
          {
            label: '姓名',
            prop: 'name',
          },
          {
            label: '性别',
            prop: 'sex',
            formatter: ({ sex }) => (sex === 1 ? '男' : '女'),
          },
          {
            label: '邮箱',
            prop: 'accountEmail',
          },
          {
            label: '电话',
            prop: 'phone',
          },
          {
            label: '公司',
            prop: 'company',
          },
          {
            label: '国家/地区',
            prop: 'area',
          },
          {
            label: '垂直市场',
            prop: 'verticalMarket',
          },
          {
            label: '怎样找到',
            prop: 'howFind',
          },
          {
            label: '注册时间',
            prop: 'createTime',
          },
          {
            label: '操作',
            prop: 'operation',
            width: 160,
            fixed: 'right',
            setBtns: (row) => {
              const btns = [
                {
                  label: '允许',
                  handler: () => {
                    this.handleAudit('agree', row)
                  },
                },
                {
                  label: '拒绝',
                  className: 'red',
                  handler: () => {
                    this.handleAudit('refused', row)
                  },
                },
              ]
              return this.$ac.operationAccess(btns)
            },
          },
        ],
        searchForm: [
          {
            $type: 'input',
            $id: 'name',
            label: '邮箱',
            $el: {
              clearable: true,
              placeholder: '请输入',
            },
          },
        ],
      }
    },
  },
  methods: {
    async handleAudit(type, row) {
      try {
        const title = `【${row.name}】${row.sex === 1 ? '先生' : '女士'}`

        const params = {
          id: row.id,
          isHandle: 1,
          handleResult: '已处理',
          handleRemark: '',
        }
        if (type === 'agree') {
          await this.$confirm(`您即将允许${title}的注册申请`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning',
          })
          params.isHandle = 1
        } else {
          const { value } = await this.$prompt(`您即将拒绝${title}的注册申请`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            inputPlaceholder: '请输入拒绝原因（必填）',
            inputPattern: /\S/,
            inputErrorMessage: '拒绝原因不能为空',
          })

          params.isHandle = 2
          params.handleRemark = value
        }

        const { code, msg } = await this.$axios.$put(api.userHandle, params)
        if (+code !== 200) {
          throw new Error(msg || '操作失败')
        }
        this.$message.success('操作成功')
        this.$refs.dataTable.goPage() // 刷新界面
      } catch (err) {
        err.message && this.$message.error(err.message)
      }
    },
  },
}
</script>

<style lang="less" scoped></style>
